<template>
<view class="container">
  <!-- <view class='top_meun_tab'>
    <view class='top_meun_tab_item' wx:for="{{tabItem}}" catchtap='changeStateProcess' data-index="{{tabItem.state}}" wx:key='{{index}}' wx:for-item="tabItem" style='border-color:{{tabItem.state==currentIndex?setting.platformSetting.defaultColor:"#fff"}};color:{{tabItem.state==currentIndex?setting.platformSetting.defaultColor:""}}'>
      <text>{{tabItem.text}}</text>
    </view>
  </view> -->
  <view class="process_list">
    <block v-if="processList.length!=0">
      <process-instance-item-component :receiveData="processItem" v-for="(processItem, index) in processList" :key="index"></process-instance-item-component>
    </block>
    <block v-else>
      <view class="none_list">主人~您还没有任何工作单哦！</view>
    </block>
  </view>
</view>
</template>

<script>
// import posters from "../../view/partials/canvas/index";
// import processInstanceItem from "../../view/partials/processInstanceItemThree/index";

export default {
  data() {
    return {
      processList: [],
      currentIndex: 0,
      localPoint: {
        longitude: 0,
        latitude: 0
      },
	  tabItem:[
		{ text: "派单中", state: 0, params: { instanceStatus: 0 }},
		{ text: "服务中", state: 1, params: { instanceStatus: 1 }},
		{ text: "已完成", state: 2, params: { instanceStatus: 2 } },
		{ text: "已取消", state: 3, params: { instanceStatus: 3 } }
	  ],
      params: {},
      listPage: {
        page: 1,
        pageSize: 0,
        totalSize: 0
      },
      setting: "",
      loginUser: ""
    };
  },
  props: {},
  onLoad: function (options) {
    console.log('===options===', options);
    let that = this;
    that.setData({
      tabItem: that.tabItem
    });

    if (options && options.actionEvent) {
      let params = JSON.parse(options.actionEvent);
      that.doAction(params);
    }

    that.params = options;
    let localPoint = that.localPoint;
    wx.getLocation({
      type: 'gcj02',
      //返回可以用于wx.openLocation的经纬度
      success: function (res) {
        console.log('==getLocation==', res);
        localPoint.latitude = res.latitude;
        localPoint.longitude = res.longitude;
        that.setData({
          localPoint: localPoint
        });
        that.getProcessList();
      }
    }); // that.getProcessList();
  },

  /**
   * 生命周期函数--监听页面初次渲染完成
   */
  onReady: function () {
    let that = this;
    that.setData({
      setting: getApp().globalData.setting,
      loginUser: getApp().globalData.loginUser
    });
  },

  /**
   * 生命周期函数--监听页面显示
   */
  onShow: function () {
    let that = this;
    that.getProcessList(); // if (this.data.reflesh == 1) {
    //   this.onPullDownRefresh()
    // }
  },

  /**
   * 生命周期函数--监听页面隐藏
   */
  onHide: function () {},

  /**
   * 生命周期函数--监听页面卸载
   */
  onUnload: function () {},

  /**
   * 页面相关事件处理函数--监听用户下拉动作
   */
  onPullDownRefresh: function () {
    this.listPage.page = 1;
    this.getProcessList();
    getApp().globalData.get_session_userinfo();
    wx.stopPullDownRefresh();
  },

  /**
   * 页面上拉触底事件的处理函数
   */
  onReachBottom: function () {
    console.log('===onReachBottom====');
    var that = this;

    if (that.listPage.totalSize > that.listPage.page * that.listPage.pageSize) {
      that.listPage.page++;
      this.getProcessList();
    }
  },
  methods: {
    changeStateProcess: function (e) {
      let that = this;
      console.log("===changeStateProcess===", e);
      let index = e.currentTarget.dataset.index;
      that.listPage.page = 1;
      that.setData({
        currentIndex: index
      });
      that.getProcessList();
    },

    /* 获取可抢单数据 */
    getProcessList: function () {
      let that = this;
      if (!getApp().globalData.checkIfLogin()) return;
      let getParams = {};
      wx.showToast({
        title: '加载中...',
        icon: 'loading'
      });
      getParams.page = that.listPage.page;
      getParams.instanceStatus = that.currentIndex;
      let customIndex = getApp().globalData.AddClientUrl("/wx_get_servant_unassign_snatch_process_instance_list.html", getParams);
      wx.request({
        url: customIndex.url,
        header: getApp().globalData.header,
        success: function (res) {
          console.log('====getProcessList-res===', res);
          let data = res.data;

          if (typeof res.data == 'string') {
            data = JSON.parse(res.data);
          }

          if (data.errcode == 0) {
            that.listPage.pageSize = data.relateObj.pageSize;
            that.listPage.totalSize = data.relateObj.totalSize;
            let dataArr = that.processList;

            if (!data.relateObj.result || data.relateObj.result.length == 0 || that.listPage.page == 1) {
              dataArr = null;
              that.setData({
                processList: []
              });
            }

            dataArr = (dataArr || []).concat(data.relateObj.result);
            that.setData({
              processList: dataArr
            });

            if (dataArr) {
              wx.hideToast();
            }
          }

          console.log('===processList===', that.processList);
        },
        complete: function (res) {}
      });
    },
    getProcessDetail: function (processId, callback) {
      console.log('==processId==', processId);
      let that = this;
      let params = {};
      params.processInstanceId = processId;
      let customIndex = getApp().globalData.AddClientUrl("/wx_get_process_instance_detail.html", params);
      wx.request({
        url: customIndex.url,
        header: getApp().globalData.header,
        success: function (res) {
          console.log('====getProcessDetail-res===', res);

          if (res.data.errcode == 0) {
            if (callback) {
              callback(res);
            }

            ;
            that.setData({
              processList: dataArr
            });
          }
        },
        complete: function (res) {}
      });
    },
    setData: function (obj) {
      let that = this;
      let keys = [];
      let val, data;
      Object.keys(obj).forEach(function (key) {
        keys = key.split('.');
        val = obj[key];
        data = that.$data;
        keys.forEach(function (key2, index) {
          if (index + 1 == keys.length) {
            that.$set(data, key2, val);
          } else {
            if (!data[key2]) {
              that.$set(data, key2, {});
            }
          }

          data = data[key2];
        });
      });
    }
  }
};
</script>
<style>
@import "./index.css";
</style>